<template>
	<div class="page-wrap">
		<div class="page-inner">
			<div class="page-ctx-wrap">
				<el-tabs v-model="activeName" @tab-click="handleClick">
					<el-tab-pane label="基础信息" name="基础信息">
						<div class="panel-item" data-title="基础信息">
							<div class="section-title">基础信息</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">公司Logo</div>
									<div class="val">
										<!-- <el-input clearable="" v-model="form.comLogo" placeholder=""> </el-input> -->

										<div class="upload-box">
											<el-upload class="upload-image" list-type="picture-card" accept="image/*"
												:multiple="upload_config_map['comLogo'].multiple"
												:limit="upload_config_map['comLogo'].limit" :name="upload_name"
												:action="mix_upload_action" :data="upload_data"
												:file-list="upload_result_map['comLogo']"
												:on-success="(res, file, fileList) => upload_on_success({ item: { field: 'comLogo' }, res, file, fileList })"
												:on-remove="(file, fileList) => upload_on_remove({ item: { field: 'comLogo' }, file, fileList })"
												:before-upload="upload_before_upload" :on-preview="upload_on_preview">
												<i class="el-icon-plus" v-if="upload_config_map['comLogo'].limit"> </i>
												<div class="el-upload__tip" slot="tip"
													v-if="upload_config_map['comLogo'].tip">
													{{ upload_config_map['comLogo'].tip || "" }}
												</div>
											</el-upload>
										</div>

									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">公司名称</div>
									<div class="val">
										<el-input clearable="" v-model="form.comTitle" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">公司简介</div>
									<div class="val">
										<el-input clearable="" v-model="form.comDesc" placeholder=""> </el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">公司荣誉</div>
									<div class="val">
										<el-input clearable="" v-model="form.comHonor" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">版权备案信息</div>
									<div class="val">
										<el-input clearable="" type="textarea" v-model="form.comBeian" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">提现最小金额</div>
									<div class="val">
										<el-input clearable="" v-model="form.comXieyi" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<!-- <div class="input-item">
								<div class="input-box">
									<div class="label">副标题</div>
									<div class="val">
										<el-input clearable="" v-model="form.snRule" placeholder=""> </el-input>
									</div>
								</div>
							</div> -->
							<div class="input-item">
								<div class="input-box">
									<div class="label">分享介绍</div>
									<div class="val">
										<el-input clearable="" v-model="form.shareDesc" placeholder=""> </el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">客服电话</div>
									<div class="val">
										<el-input clearable="" v-model="form.comKefu" placeholder=""> </el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">网站电话</div>
									<div class="val">
										<el-input clearable="" v-model="form.comPhone" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">网站邮箱</div>
									<div class="val">
										<el-input clearable="" v-model="form.comEmail" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">公司地址</div>
									<div class="val">
										<el-input clearable="" v-model="form.comAddress" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">提现比例</div>
									<div class="val">
										<el-input clearable="" v-model="form.tixianBili" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<!-- <div class="input-item">
								<div class="input-box">
									<div class="label">佣金比例</div>
									<div class="val">
										<el-input clearable="" v-model="form.fanBiLi" placeholder="最大为1">
										</el-input>
									</div>
								</div>
							</div> -->
							<!-- <div class="input-item">
								<div class="input-box">
									<div class="label">联系电话</div>
									<div class="val">
										<el-input clearable="" v-model="form.snRule" placeholder=""> </el-input>
									</div>
								</div>
							</div> -->
							<!-- <div class="input-item">
								<div class="input-box">
									<div class="label">客服微信</div>
									<div class="val">
										<el-input clearable="" v-model="form.snRule" placeholder=""> </el-input>
									</div>
								</div>
							</div> -->
							<!-- <div class="input-item">
								<div class="input-box">
									<div class="label">发货地址</div>
									<div class="val">
										<el-input clearable="" v-model="form.comAddress" placeholder="">
										</el-input>
									</div>
								</div>
							</div> -->
							<div class="input-item">
								<div class="input-box">
									<div class="label">地址经纬度坐标</div>
									<div class="val">
										<el-input clearable="" v-model="form.comCoordinate" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">小程序图片</div>
									<div class="val">
										<el-input clearable="" v-model="form.appletImg" placeholder=""> </el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">小程序分享图片</div>
									<div class="val">


										<div class="upload-box">
											<el-upload class="upload-image" list-type="picture-card" accept="image/*"
												:multiple="upload_config_map['shareImg'].multiple"
												:limit="upload_config_map['shareImg'].limit" :name="upload_name"
												:action="mix_upload_action" :data="upload_data"
												:file-list="upload_result_map['shareImg']"
												:on-success="(res, file, fileList) => upload_on_success({ item: { field: 'shareImg' }, res, file, fileList })"
												:on-remove="(file, fileList) => upload_on_remove({ item: { field: 'shareImg' }, file, fileList })"
												:before-upload="upload_before_upload" :on-preview="upload_on_preview">
												<i class="el-icon-plus" v-if="upload_config_map['shareImg'].limit"> </i>
												<div class="el-upload__tip" slot="tip"
													v-if="upload_config_map['shareImg'].tip">
													{{ upload_config_map['shareImg'].tip || "" }}
												</div>
											</el-upload>
										</div>


									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">视频封面</div>
									<div class="val">

										<div class="upload-box">
											<el-upload class="upload-image" list-type="picture-card" accept="image/*"
												:multiple="upload_config_map['videoImg'].multiple"
												:limit="upload_config_map['videoImg'].limit" :name="upload_name"
												:action="mix_upload_action" :data="upload_data"
												:file-list="upload_result_map['videoImg']"
												:on-success="(res, file, fileList) => upload_on_success({ item: { field: 'videoImg' }, res, file, fileList })"
												:on-remove="(file, fileList) => upload_on_remove({ item: { field: 'videoImg' }, file, fileList })"
												:before-upload="upload_before_upload" :on-preview="upload_on_preview">
												<i class="el-icon-plus" v-if="upload_config_map['videoImg'].limit"> </i>
												<div class="el-upload__tip" slot="tip"
													v-if="upload_config_map['videoImg'].tip">
													{{ upload_config_map['videoImg'].tip || "" }}
												</div>
											</el-upload>
										</div>

									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">视频</div>
									<div class="val">

										<div class="upload-box">
											<el-upload class="upload-file" list-type="text" accept="video/*"
												:multiple="upload_config_map['videoUpload'].multiple"
												:limit="upload_config_map['videoUpload'].limit" :name="upload_name"
												:action="mix_upload_action" :data="upload_uploadFile"
												:file-list="upload_result_map['videoUpload']"
												:on-success="(res, file, fileList) => upload_on_success({ item: { field: 'videoUpload' }, res, file, fileList })"
												:on-remove="(file, fileList) => upload_on_remove({ item: { field: 'videoUpload' }, file, fileList })"
												:before-upload="upload_before_upload_video"
												:on-preview="upload_on_preview">
												<i class="el-icon-plus" v-if="upload_config_map['videoUpload'].limit">
												</i>
												<div class="el-upload__tip" slot="tip"
													v-if="upload_config_map['videoUpload'].tip">
													{{ upload_config_map['videoUpload'].tip || "" }}
												</div>
											</el-upload>
										</div>
										<div class="val">
											<el-input clearable="" v-model="form.videoUrl" placeholder=""> </el-input>
										</div>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">公众号图片</div>
									<div class="val">
										<!-- <el-input clearable="" v-model="form.accountImg" placeholder=""> </el-input> -->
										<el-upload class="upload-image" list-type="picture-card" accept="image/*"
											:multiple="upload_config_map['accountImg'].multiple"
											:limit="upload_config_map['accountImg'].limit" :name="upload_name"
											:action="mix_upload_action" :data="upload_data"
											:file-list="upload_result_map['accountImg']"
											:on-success="(res, file, fileList) => upload_on_success({ item: { field: 'accountImg' }, res, file, fileList })"
											:on-remove="(file, fileList) => upload_on_remove({ item: { field: 'accountImg' }, file, fileList })"
											:before-upload="upload_before_upload" :on-preview="upload_on_preview">
											<i class="el-icon-plus" v-if="upload_config_map['accountImg'].limit"> </i>
											<div class="el-upload__tip" slot="tip"
												v-if="upload_config_map['accountImg'].tip">
												{{ upload_config_map['accountImg'].tip || "" }}
											</div>
										</el-upload>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">分享描述</div>
									<div class="val">
										<el-input clearable="" v-model="form.shareDesc" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
						</div>
					</el-tab-pane>
					<el-tab-pane label="活动与支付" name="活动与支付">
						<div class="panel-item" data-title="活动与支付">
							<!-- <div class="section-title">活动与支付</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">开启拼团</div>
									<div class="val">
										<el-radio-group v-model="form.ifPinTuan" class="column">
											<el-radio :label="0">关闭</el-radio>
											<el-radio :label="1"> 开启 </el-radio>
										</el-radio-group>
									</div>
								</div>
							</div> -->
							<div class="input-item">
								<div class="input-box">
									<div class="label">开启提现</div>
									<div class="val">
										<el-radio-group v-model="form.ifTixian" class="column">
											<el-radio :label="0">关闭</el-radio>
											<el-radio :label="1"> 开启 </el-radio>
										</el-radio-group>
									</div>
								</div>
							</div>

							<div class="input-item">
								<div class="input-box">
									<div class="label">提现手续费</div>
									<div class="val">
										<el-input clearable="" v-model="form.tixianBili" placeholder="">
										</el-input>
									</div>
								</div>
							</div>
						</div>
					</el-tab-pane>
					<el-tab-pane label="物流配置" name="物流配置">
						<div class="panel-item" data-title="物流配置">
							<div class="section-title">物流配置</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">物流接入平台</div>
									<div class="val">
										<el-radio-group v-model="form.expressType" class="column">
											<el-radio :label="3">无</el-radio>
											<el-radio :label="0"> 快递鸟 </el-radio>
											<el-radio :label="1"> 快递100 </el-radio>
										</el-radio-group>
									</div>
								</div>
							</div>

							<div class="input-sec" v-if="form.expressType == 0">
								<div class="input-item">
									<div class="input-box">
										<div class="label">快递鸟用户id</div>
										<div class="val">
											<el-input clearable="" v-model="form.kdnEBusinessID" placeholder="">
											</el-input>
										</div>
									</div>
								</div>
								<div class="input-item">
									<div class="input-box">
										<div class="label">快递鸟Key</div>
										<div class="val">
											<el-input clearable="" v-model="form.kdnKey" placeholder="">
											</el-input>
										</div>
									</div>
								</div>
								<div class="input-item">
									<div class="input-box">
										<div class="label">快递鸟端口</div>
										<div class="val">
											<el-input clearable="" v-model="form.kdnPort" placeholder="">
											</el-input>
										</div>
									</div>
								</div>
							</div>

							<div class="input-sec" v-if="form.expressType == 1">
								<div class="input-item">
									<div class="input-box">
										<div class="label">快递100-KEY</div>
										<div class="val">
											<el-input clearable="" v-model="form.kd100Key" placeholder="">
											</el-input>
										</div>
									</div>
								</div>
								<div class="input-item">
									<div class="input-box">
										<div class="label">快递100-编号</div>
										<div class="val">
											<el-input clearable="" v-model="form.kd100Customer" placeholder="">
											</el-input>
										</div>
									</div>
								</div>
							</div>
						</div>
					</el-tab-pane>
					<el-tab-pane label="时限设置" name="时限设置">
						<div class="panel-item" data-title="时限设置">
							<div class="section-title">时限设置</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">订单支付时限</div>
									<div class="val">
										<el-input clearable="" v-model="form.timePay" type="number" placeholder="">
											<template slot="append">分钟</template></el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">自动收货时间</div>
									<div class="val">
										<el-input clearable="" v-model="form.timeShouhuo" type="number" placeholder="">
											<template slot="append">天</template>
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">成团时间</div>
									<div class="val">
										<el-input clearable="" v-model="form.timeTuan" type="number" placeholder="">
											<template slot="append">分钟</template>
										</el-input>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">自动好评时间</div>
									<div class="val">
										<el-input clearable="" v-model="form.timeComment" type="number" placeholder="">
											<template slot="append">天</template>
										</el-input>
									</div>
								</div>
							</div>
							<!-- <div class="input-item">
								<div class="input-box">
									<div class="label">可售后时间</div>
									<div class="val">
										<el-input clearable="" v-model="form.shareDesc" placeholder="">
										</el-input>
									</div>
								</div>
							</div> -->
						</div>
					</el-tab-pane>
					<!-- <el-tab-pane label="订单取消原因" name="订单取消原因">
						<div class="panel-item" data-title="订单取消原因">
							<div class="section-title">订单取消原因</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">标签列表</div>
									<div class="val">
										<div class="tag-wrap">
											<div type="标签列表" class="tag-list-box">
												<el-tag size="small" :key="tag" v-for="tag in tagList" closable :disable-transitions="false"
													@close="tagClose(tag)">
													{{ tag }}
												</el-tag>
												<el-input clearable="" class="input-new-tag" v-if="tagInputVisible" v-model="tagInputValue" ref="tagInputRef"
													size="small" @keyup.enter.native="tagInputConfirm()" @blur="tagInputConfirm()">
												</el-input>
												<el-button v-else class="button-new-tag" size="small" @click="tagShowInput()">+ 添加</el-button>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</el-tab-pane> -->
					<el-tab-pane label="退换货原因" name="退换货原因">
						<div class="panel-item" data-title="退换货原因">
							<div class="section-title">退换货原因</div>
							<div class="input-item">
								<div class="table-sec">
									<el-table :data="dataList_tuihuanReason" stripe border>
										<el-table-column v-for="(item, index) in tableColumns_tuihuanReason"
											:key="index + item.prop" :prop="item.prop" :label="item.label"
											:width="item.width">
											<template slot-scope="scope">
												<div class="id-text">
													<el-input clearable="" v-model="scope.row[item.prop]"> </el-input>
												</div>
											</template>
										</el-table-column>

										<el-table-column label="操作" width="120">
											<template slot-scope="scope">
												<el-button @click="do_delete_tuihuanReason(scope.row, scope)"
													type="text">删除</el-button>
											</template>
										</el-table-column>
									</el-table>

									<div class="loop-add">
										<el-button type="primary" @click="do_add_tuihuanReason()"> 增加 </el-button>
									</div>
								</div>

							</div>
						</div>
					</el-tab-pane>
					<el-tab-pane label="意见反馈" name="意见反馈">

						<div class="panel-item" data-title="意见反馈">
							<div class="section-title">意见反馈</div>
							<div class="input-item">
								<div class="table-sec">
									<el-table :data="dataList_feedType" stripe border>
										<el-table-column v-for="(item, index) in tableColumns_feedback"
											:key="index + item.prop" :prop="item.prop" :label="item.label"
											:width="item.width">
											<template slot-scope="scope">
												<div class="id-text">
													<el-input clearable="" v-model="scope.row[item.prop]"> </el-input>
												</div>
											</template>
										</el-table-column>

										<el-table-column label="操作" width="120">
											<template slot-scope="scope">
												<el-button @click="do_delete_feedback(scope.row, scope)"
													type="text">删除</el-button>
											</template>
										</el-table-column>
									</el-table>

									<div class="loop-add">
										<el-button type="primary" @click="do_add_feedback()"> 增加 </el-button>
									</div>
								</div>

							</div>
						</div>


					</el-tab-pane>
					<el-tab-pane label="热搜词" name="热搜词">
						<div class="panel-item" data-title="热搜词">
							<div class="section-title">热搜词</div>
							<div class="input-item">
								<div class="table-sec">
									<el-table :data="dataList_hotSearch" stripe border>
										<el-table-column v-for="(item, index) in tableColumns_hotSearch"
											:key="index + item.prop" :prop="item.prop" :label="item.label"
											:width="item.width">
											<template slot-scope="scope">
												<div class="id-text">
													<el-input clearable="" v-model="scope.row[item.prop]"> </el-input>
												</div>
											</template>
										</el-table-column>

										<el-table-column label="操作" width="120">
											<template slot-scope="scope">
												<el-button @click="do_delete_hotSearch(scope.row, scope)"
													type="text">删除</el-button>
											</template>
										</el-table-column>
									</el-table>

									<div class="loop-add">
										<el-button type="primary" @click="do_add_hotSearch()"> 增加 </el-button>
									</div>
								</div>

							</div>
						</div>
					</el-tab-pane>

					<el-tab-pane label="首页购买记录" name="首页购买记录">
						<div class="panel-item" data-title="首页购买记录">
							<div class="section-title">首页购买记录</div>
							<div class="input-item">


								<div class="table-sec">
									<el-table :data="dataList_buyLogs" stripe border>
										<template v-for="(item, index) in tableColumns_buyLogs">
											<el-table-column :key="index + item.prop" :prop="item.prop"
												:label="item.label" :width="item.width">
												<template slot-scope="scope">
													<div class="id-text">
														<el-input clearable="" v-model="scope.row[item.prop]">
														</el-input>
													</div>
												</template>
											</el-table-column>
										</template>
										<el-table-column fixed="right" label="操作" width="120">
											<template slot-scope="scope">
												<div data-title="列表操作" class="row-actions-box">
													<el-button @click="do_delete_log(scope.row, scope)"
														type="text">删除</el-button>
												</div>
											</template>
										</el-table-column>
									</el-table>

									<div class="loop-add">
										<el-button type="primary" @click="do_add_record_buy_log()"> 增加 </el-button>
									</div>
								</div>


							</div>
						</div>
					</el-tab-pane>


					<el-tab-pane label="开发设置" name="开发设置">
						<div class="panel-item" data-title="开发设置">
							<div class="section-title">开发设置</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">启用开发屏蔽</div>
									<div class="val">
										<el-radio-group v-model="form.appletState" class="column">
											<el-radio :label="0">否</el-radio>
											<el-radio :label="1">是</el-radio>
										</el-radio-group>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label ">注：</div>
									<div class="val">
										<div class="input-tip">此功能主要解决小程序发布时过审不通过的问题。（如某些内容展示不符合当前类目或无资质）。<br />
											微信小程序发布后应设置【否】，否则可能会导致部分小程序内容不展示</div>
									</div>
								</div>
							</div>
						</div>
					</el-tab-pane>

					<el-tab-pane label="软件更新" name="软件更新">
						<div class="panel-item" data-title="软件更新">
							<div class="section-title">软件更新</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">启用开发屏蔽</div>
									<div class="val">
										<el-radio-group v-model="update.type" class="column">
											<!-- 更新目录：0-PC端 （dist_pc） 1-后台页面（dist_admin） 2-H5端（dist_h5） -->
											<el-radio :label="0">PC端</el-radio>
											<el-radio :label="1">后台</el-radio>
											<el-radio :label="2">H5端</el-radio>
										</el-radio-group>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">上传压缩包</div>
									<div class="val">
										<!-- style=" display: flex;justify-content: space-between;" -->
										<!-- <div
											style="display: flex; font-size: 14px; margin-bottom: 5px; color: #4F4F4F;">
											{{ update.zipfile }}
											<button class="del-image3d" @click="del_zipfile(update)"
												v-if="update.zipfile != ''">X</button>
										</div> -->
										<el-upload class="upload-demo" :action="mix_upload_action" accept=".zip"
											:data="upload_uploadFile" :multiple="false" :limit="1"
											:on-success="(res, file, fileList) => do_upload_success(res, file, fileList, update)">
											<el-button size="small" type="primary">点击上传</el-button>
											<div slot="tip" class="el-upload__tip">只能上传zip文件</div>
										</el-upload>
										<!-- <el-button type="primary" style="height: 32px;" @click="doUpdate()"> 提 交 更 新
										</el-button> -->
										<!-- <input type="file" @change="handleFileChange" ref="fileInput" />
										<el-button @click="uploadFile">上传文件</el-button> -->
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label ">注：</div>
									<div class="val">
										<div class="input-tip">更新目录：pc端的就解压到 dist_pc 目录下，后台的就解压到 dist_admin 目录下，H5端解压到
											dist_h5 目录下</div>
									</div>
								</div>
							</div>
							<!-- <div class="update-actions">
								<el-button type="primary" @click="doUpdate()"> 更 新 </el-button>
							</div> -->
						</div>
					</el-tab-pane>
				</el-tabs>
			</div>
		</div>

		<div class="footer-actions">
			<!-- <el-button @click="formCancel()"> 取消 </el-button> -->
			<el-button type="primary" @click="doSubmit()"> 保存 </el-button>
		</div>

		<el-dialog :visible.sync="dialogVisible">
			<img width="100%" :src="dialogImageUrl" alt="">
		</el-dialog>

	</div>
</template>

<script>
import {
	mapState
} from "vuex";
export default {
	name: "news",
	components: {},
	data() {
		return {
			activeName: "基础信息",

			update: {
				type: 0,
				zipfile: '',
			},

			form: {
				//
				// action: "action",
				// token: "token",
				comTitle: "",
				comLogo: "",
				comEmail: "",
				comPhone: "",
				comBeian: "",
				comXieyi: "",
				comKefu: "",
				comAddress: "",
				comCoordinate: "",
				comDesc: "",
				comHonor: "",
				shareDesc: "",
				shareImg: "",
				timePay: "",
				timeShouhuo: "",
				timeTuan: "",
				timeComment: "",
				tuihuanReason: "",
				qxReason: "",
				feedType: "",
				ifPinTuan: 0,
				ifTixian: "",
				tixianBili: "",
				fanBiLi: "",
				expressType: "",
				kdnEBusinessID: "",
				kdnKey: "",
				kdnPort: "",
				kd100Key: "",
				kd100Customer: "",
				hotSearch: "",
				appletImg: "",
				videoUrl: "",
				accountImg: "",
				buyLogs: "",
				appletState: "",
				videoImg: "",
				videoUpload: "",
			},

			// 标签
			tagList: [],
			tagInputVisible: false,
			tagInputValue: "",
			tagInputRef: "tagInputRef",
			// 标签

			selectedFile: null,
			// 上传
			upload_name: "file",
			upload_data: {
				action: 'upload_uploadImg',
				token:localStorage.getItem("token")
			},
			upload_uploadFile: {
				action: 'upload_uploadFile'
			},

			upload_result_map: {
				'comLogo': [],
				'shareImg': [],
				'videoImg': [],
				'accountImg': [],
				'videoUpload': [],
			},
			//
			dialogImageUrl: "",
			dialogVisible: false,
			// 上传
			upload_config_map: {
				'comLogo': {
					multiple: false,
					limit: 1,
					tip: '请选择文件',
				},
				'shareImg': {
					multiple: false,
					limit: 1,
					tip: '请选择文件',
				},
				'videoImg': {
					multiple: false,
					limit: 1,
					tip: '请选择文件',
				},
				'accountImg': {
					multiple: false,
					limit: 1,
					tip: '请选择文件',
				},
				'videoUpload': {
					multiple: false,
					limit: 1,
					tip: '请选择文件',
				}
			},



			// 退换原因
			dataList_tuihuanReason: [{
				title: '',
			}],
			tableColumns_tuihuanReason: [{
				prop: "title",
				label: "原因",
				width: "auto",
			}],

			// 意见反馈
			dataList_feedType: [{
				title: '',
			}],
			tableColumns_feedback: [{
				prop: "title",
				label: "类型",
				width: "auto",
			}],

			// 热搜词
			dataList_hotSearch: [{
				title: '',
			}],
			tableColumns_hotSearch: [{
				prop: "title",
				label: "热搜词",
				width: "auto",
			}],


			// 购买记录
			dataList_buyLogs: [{
				title: '',
			}],
			tableColumns_buyLogs: [{
				prop: "title",
				label: "购买记录",
				width: "auto",
			}],

		};
	},
	computed: {},
	watch: {},
	created() {
		this.setView();
	},
	mounted() { },
	methods: {
		setView() {
			this.$api({
				url: '/admin_service.php',
				method: "get",
				data: {
					action: "setting_getConfig",
				},
			}).then((res) => {
				let data = res.data;
				if (res.code == 200) {
					this.info = data;
					console.log(data);

					this.form = {
						comTitle: data.comTitle || "",
						comLogo: data.comLogo || "",
						comEmail: data.comEmail || "",
						comPhone: data.comPhone || "",
						comBeian: data.comBeian || "",
						comXieyi: data.comXieyi || "",
						comKefu: data.comKefu || "",
						comAddress: data.comAddress || "",
						comCoordinate: data.comCoordinate || "",
						comDesc: data.comDesc || "",
						comHonor: data.comHonor || "",
						shareDesc: data.shareDesc || "",
						shareImg: data.shareImg || "",
						timePay: data.timePay || "",
						timeShouhuo: data.timeShouhuo || "",
						timeTuan: data.timeTuan || "",
						timeComment: data.timeComment || "",
						tuihuanReason: data.tuihuanReason || "",
						qxReason: data.qxReason || "",
						feedType: data.feedType || "",
						ifPinTuan: data.ifPinTuan || "",
						ifTixian: data.ifTixian || "",
						tixianBili: data.tixianBili || "",
						fanBiLi: data.fanBiLi || "",
						expressType: data.expressType,
						kdnEBusinessID: data.kdnEBusinessID || "",
						kdnKey: data.kdnKey || "",
						kdnPort: data.kdnPort || "",
						kd100Key: data.kd100Key || "",
						kd100Customer: data.kd100Customer || "",
						hotSearch: data.hotSearch || "",
						appletImg: data.appletImg || "",
						videoUrl: data.videoUrl || "",
						accountImg: data.accountImg || "",
						buyLogs: data.buyLogs || "",
						appletState: data.appletState || "",
						videoImg: data.videoImg || "",
						videoUpload: data.videoUpload || "",
					};




					// 意见反馈
					if (data.tuihuanReason) {
						this.dataList_tuihuanReason = JSON.parse(data.tuihuanReason)
					}
					// 意见反馈
					if (data.feedType) {
						this.dataList_feedType = JSON.parse(data.feedType)
					}
					// 热搜词
					if (data.hotSearch) {
						this.dataList_hotSearch = JSON.parse(data.hotSearch)
					}
					// 购买记录
					if (data.buyLogs) {
						this.dataList_buyLogs = JSON.parse(data.buyLogs)
					}


					this.format_image_render('comLogo')
					this.format_image_render('shareImg')
					this.format_image_render('videoImg')
					this.format_image_render('accountImg')
					this.format_image_render('videoUpload')

				}
			});
		},


		format_image_render(field) {
			let value = this.info[field];
			let url_list = [];
			if (typeof value == 'string') {
				url_list = value.split(',')
			} else if (typeof value == 'object') {
				url_list = value
			}
			this.upload_result_map[field] = url_list.map(v => ({
				name: v,
				url: v,
				response: {
					data: {
						name: v,
						url: v,
					}
				}
			}))
		},

		get_image_form_value(field) {
			let fileList = this.upload_result_map[field] || []
			let value = fileList.map(v => v.response.data.url).join(',')
			return value
		},

		doUpdate() {
			this.$api({
				url: '/admin_service.php',
				method: "get",
				data: {
					action: "setting_updateH5",
					...this.update,
				},
			}).then((res) => {
				alert(res);
			});
		},

		doSubmit() {
			//退换原因
			let tuihuanReason = this.dataList_tuihuanReason.filter(v => v.title) || []
			try {
				tuihuanReason = JSON.stringify(tuihuanReason)
			} catch (e) {
				//TODO handle the exception
			}
			//反馈类型
			let feedType = this.dataList_feedType.filter(v => v.title) || []
			try {
				feedType = JSON.stringify(feedType)
			} catch (e) {
				//TODO handle the exception
			}
			//特搜词
			let hotSearch = this.dataList_hotSearch.filter(v => v.title) || []
			try {
				hotSearch = JSON.stringify(hotSearch)
			} catch (e) {
				//TODO handle the exception
			}
			//购买记录
			let buyLogs = this.dataList_buyLogs.filter(v => v.title) || []
			try {
				buyLogs = JSON.stringify(buyLogs)
			} catch (e) {
				//TODO handle the exception
			}


			let params = {
				...this.form,
				comLogo: this.get_image_form_value('comLogo'),
				shareImg: this.get_image_form_value('shareImg'),
				videoImg: this.get_image_form_value('videoImg'),
				accountImg: this.get_image_form_value('accountImg'),
				videoUrl: this.get_image_form_value('videoUpload'),
				tuihuanReason: tuihuanReason,
				feedType: feedType,
				hotSearch: hotSearch,
				buyLogs: buyLogs, //购买记录
			};


			this.$api({
				url: '/admin_service.php',
				method: "get",
				data: {
					action: "setting_setConfig",
					...params,
				},
			}).then((res) => {
				alert(res);
			});
		},

		// 标签列表
		tagClose(tag) {
			this.tagList.splice(this.tagList.indexOf(tag), 1);
		},
		tagShowInput() {
			this.tagInputVisible = true;

			setTimeout(() => {
				this.$nextTick(() => {
					// this.$refs["tagInputRef"].$refs.input.focus();
					this.$refs["tagInputRef"][0].$refs.input.focus();
				});
			}, 50);
		},
		tagInputConfirm() {
			let tagInputValue = this.tagInputValue.trim();
			if (tagInputValue) {
				if (this.tagList.includes(tagInputValue)) {
					alertErr("型号已存在！");
					// return
				} else {
					this.tagList.push(tagInputValue);
				}
			}
			this.tagInputVisible = false;
			this.tagInputValue = "";
		},
		// 标签列表

		handleClick(tab, event) {
			console.log(tab, event);
		},

		del_zipfile() {
			this.update.zipfile = ''
		},

		do_upload_success(res, file, fileList, update) {
			const formData = new FormData();
			formData.append('zipfile', file.raw);
			formData.append('type', this.update.type);
			this.$uploadApi(formData).then((res) => {
				const { code, data, msg } = res;
				alert(msg);
			});


			// if (res.code == 200) {
			// 	update.zipfile = formData
			// } else if (file.type != 'application/zip') {
			// 	alertErr('仅允许上传 ZIP 文件');
			// 	const index = fileList.indexOf(file);
			// 	if (index > -1) {
			// 		fileList.splice(index, 1);
			// 	}
			// 	return;
			// } else {
			// 	alertErr(res.msg);
			// }
		},

		// 上传逻辑

		//
		upload_before_upload(file) {
			console.warn("upload_before_upload");
			const isLt50M = file.size / 1024 / 1024 < 50; //文件大小 小于 50MB
			return isLt50M;
		},
		// 上传视频
		upload_before_upload_video(file) {
			const allowedTypes = ['video/mp4', 'video/avi', 'video/mov'];
			if (!allowedTypes.includes(file.type)) {
				this.$message.error('仅支持上传 MP4、AVI 和 MOV 格式的视频文件！');
				return false;
			}
			return true;
		},
		// 上传视频
		upload_on_success(option) {
			let {
				item,
				res,
				file,
				fileList
			} = option
			this.$log("upload_on_success option", option);
			if (res.code == 200) {
				this.$message({
					message: res.msg,
					type: 'warning'
				});
				// let url = res.data.url;
				this.upload_result_map[item.field] = fileList;
			} else {
				this.$message.error(res.msg);
			}
		},
		upload_on_remove(option) {
			let {
				item,
				file,
				fileList,
			} = option;
			this.$log('upload_on_remove option', option)
			this.upload_result_map[item.field] = fileList;
		},
		upload_on_preview(file) {
			this.dialogImageUrl = file.url;
			this.dialogVisible = true;
		},
		// 上传逻辑




		//退换货原因
		do_delete_tuihuanReason(item, scope) {
			console.warn("表格行删除", {
				...item
			});
			console.warn("表格行删除", scope);

			this.dataList_tuihuanReason.splice(scope.$index, 1);
		},
		do_add_tuihuanReason() {
			this.dataList_tuihuanReason.push({
				title: '',
			});
		},



		//意见反馈
		do_delete_feedback(item, scope) {
			console.warn("表格行删除", {
				...item
			});
			console.warn("表格行删除", scope);

			this.dataList_feedType.splice(scope.$index, 1);
		},
		do_add_feedback() {
			this.dataList_feedType.push({
				title: '',
			});
		},

		//热搜词
		do_delete_hotSearch(item, scope) {
			console.warn("表格行删除", {
				...item
			});
			console.warn("表格行删除", scope);

			this.dataList_hotSearch.splice(scope.$index, 1);
		},
		do_add_hotSearch() {
			this.dataList_hotSearch.push({
				title: '',
			});
		},


		// 购买记录
		do_delete_log(item, scope) {
			console.warn("表格行删除", {
				...item
			});
			console.warn("表格行删除", scope);

			this.dataList_buyLogs.splice(scope.$index, 1);
		},
		do_add_record_buy_log() {
			this.dataList_buyLogs.push({
				title: '',
			});
		},
	},
};
</script>

<style scoped lang="less">
/deep/ .upload-image .el-upload {
	width: 100px;
	height: 100px;
	line-height: 98px;
}

/deep/ .upload-video .el-upload {
	width: 100px;
	height: 100px;
	line-height: 98px;

	background-color: #fbfdff;
	border: 1px dashed #c0ccda;
	border-radius: 6px;
	box-sizing: border-box;
	cursor: pointer;
	vertical-align: top;
}

/deep/ .el-upload-list__item {
	background: #eef6ff !important;
	font-size: 16px;
}

.video-preview-box {
	margin-top: 20px;
}


.del-image3d {
	margin-left: 10px;
	border: none;
	background: none;
}


.footer-actions {
	display: flex;
	justify-content: flex-end;
	justify-content: center;
	position: fixed;
	z-index: 100;
	bottom: 0;
	right: 0;
	left: 230px;
	padding: 10px;
	background: #fff;
	box-shadow: 0 0 1px 0 #ccc;
	// padding-right: 35px;
	margin-right: 18px;
}

.update-actions {
	display: flex;
	justify-content: flex-end;
	justify-content: center;
	z-index: 100;
	bottom: 0;
	right: 0;
	left: 190px;
	padding: 10px;
	// background: #fff;
	// box-shadow: 0 0 1px 0 #ccc;
	padding-right: 35px;
}





// .el-radio-group.column {
//   display: flex;
//   flex-direction: column;
// }

.tip-input {
	margin-left: 20px;
	display: inline-block;
	max-width: 150px;
}

.time-divider {
	margin: 0 15px;
}

.page-wrap {
	.page-inner {}
}

.page-ctx-wrap {
	background: #fff;
	padding: 20px;
	border-radius: 6px;
}

.section-title {
	margin-bottom: 20px;
	width: 100%;
	height: auto;
	line-height: 46px;
	background: rgb(241, 242, 245);
	padding-left: 30px;
	font-size: 16px;
	font-weight: 600;
}

.panel-item {
	padding-bottom: 100px;
	// .flex();
	// flex-wrap: wrap;

	.input-item {
		margin-bottom: 20px;
		width: 100%;
		max-width: 800px;
		// width: 50%;

		&.hidden-item {
			display: none;
		}

		&:last-child {
			margin-bottom: 0;
		}

		.input-box {
			width: 100%;
			display: flex;
			align-items: flex-start;

			.label {
				height: 32px;
				line-height: 32px;
				min-width: 160px;
				min-width: 100px;
				text-align: right;
				margin-right: 40px;
				font-size: 20px;
				font-size: 14px;
				font-family: PingFang SC;
				color: #666666;

				&.required {
					position: relative;

					&:after {
						content: "*";
						color: #f00;
						position: absolute;
						right: -15px;
						top: 3px;
						// font-weight: bold;
					}
				}

				&.hidden {
					visibility: hidden;
				}
			}
		}

		//输入框组
		.inputs {
			.flex();

			.date-box {
				flex: 1;
			}

			.shuru-box {
				margin-left: 20px;
				flex: 4;
			}
		}

		.val {
			flex: 2;
			font-size: 20px;
			font-family: PingFang SC;
			color: #000000;

			.shuru {
				width: 100%;
				padding-left: 20px;
				outline: none;
				height: 40px;
				background: #ffffff;
				border: 1px solid #d4d8eb;
				border-radius: 4px;
				font-size: 16px;
			}

			.form-ele {
				.el-input {
					width: 100%;
				}

				.el-select {
					width: 100%;
				}

				.el-cascader {
					width: 100%;
				}
			}

			.input-tip {
				line-height: 32px;
				font-size: 14px;
				font-family: PingFang SC;
				color: #666;
			}
		}
	}
}

// 标签
.tag-wrap {

	// 标签样式
	.cus-tag-item {
		margin-right: 15px;
	}

	.el-tag+.el-tag {
		margin-left: 10px;
	}

	.button-new-tag {
		margin-left: 10px;
		height: 32px;
		line-height: 30px;
		padding-top: 0;
		padding-bottom: 0;
	}

	.input-new-tag {
		width: 90px;
		margin-left: 10px;
		vertical-align: bottom;
	}

	.cus-tag-input {
		-webkit-appearance: none;
		background-color: #fff;
		background-image: none;
		border-radius: 4px;
		border: 1px solid #dcdfe6;
		box-sizing: border-box;
		color: #606266;
		display: inline-block;
		outline: 0;
		padding: 0 15px;
		width: 90px;
		height: 32px;
		line-height: 32px;
		transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);

		&:focus {
			border-color: #66b1ff;
		}
	}

	// 标签样式

	.table-box {
		width: 100%;
		border-collapse: 0;
		/* table-layout: fixed; */
		border: 1px solid #eee;
		font-size: 14px;
	}

	.table-box tr {
		/* min-height: 40px; */
	}

	.table-box th {
		text-align: left;
		padding: 10px 10px;

		border-right: 1px solid #eee;
	}

	.table-box td {
		text-align: left;
		padding: 10px 10px;
		border-top: 1px solid #eee;
		border-right: 1px solid #eee;
	}

	.table-box td:nth-child(1) {
		width: 20%;
	}

	.table-box td:nth-child(2) {
		width: 80%;
	}

	.table-box .tag-item {
		cursor: pointer;
		outline: none;
		user-select: none;
		margin-right: 10px;
		display: inline-flex;
		align-items: center;
		color: #333;
	}

	.table-box .tag-item:before {
		content: "";
		width: 20px;
		height: 20px;
		display: inline-block;
		background-image: url("https://changkun.dx.hdapp.com.cn/erp/images/check-0.png");
		background-size: 100% 100%;
		background-position: center;
		background-repeat: no-repeat;
		margin-right: 3px;
	}

	.table-box .tag-item.checked:before {
		background-image: url("https://changkun.dx.hdapp.com.cn/erp/images/check-1.png");
	}
}


.loop-add {
	margin-top: 20px;
}
</style>